
import React, { memo, forwardRef } from 'react'
import { Drawer } from 'antd'
import './index.scss'
const LdFullDrawer = forwardRef((props: any, ref: any) => {
    const { placement = 'top', open = true, onClose, width = "100%", title = "详情" } = props
    const slotArr = React.Children.toArray(props?.children)
    const handleClose = () => {
        onClose && onClose()
    }
    return (
        <>
            <Drawer mask={false} destroyOnClose={true} className='ld-full-drawer' closable={false} height={width} placement={placement} open={open} onClose={handleClose}>
                <div className="drawer-header flex-between align-center">
                    <div onClick={handleClose} className="left-button"><i className="el-icon-arrow-left"></i>返回</div>
                    <div className="drawer-header__title">{title}</div>
                    <div style={{ width: '60px' }} className="mr-12"></div>
                </div>
                <div className="drawer-content">
                    {
                        slotArr.map((item: any, index: number) => {
                            return (
                                <div style={{height:'100%'}} key={index}>{item}</div>
                            )
                        })
                    }
                </div>
            </Drawer>
        </>
    )
})
export default memo(LdFullDrawer)